{include file="public/head" /}
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
            </div>
        </div>
      <!--  <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header">用户概括</div>
                <div class="layui-card-body ">
                    <!-- <ul class="layui-row layui-col-space10 layui-this x-admin-carousel x-admin-backlog">
                    <ul class="user_li">
                        <li class="user_li_li">
                            <a href="javascript:;" class="x-admin-backlog-body">
                                <h3>今日新增(人)</h3>
                                <p>
                                    <cite></cite>
                                </p>
                            </a>
                        </li>
                        <li class="user_li_li">
                            <a href="javascript:;" class="x-admin-backlog-body">
                                <h3>昨日新增(人)</h3>
                                <p>
                                    <cite></cite>
                                </p>
                            </a>
                        </li>
                        <li class="user_li_li">
                            <a href="javascript:;" class="x-admin-backlog-body">
                                <h3>本月新增(人)</h3>
                                <p>
                                    <cite></cite>
                                </p>
                            </a>
                        </li>
                        <li class="user_li_li">
                            <a href="javascript:;" class="x-admin-backlog-body">
                                <h3>总用户数(人)</h3>
                                <p>
                                    <cite></cite>
                                </p>
                            </a>
                        </li>
                    </ul>
                </div>
                <div
                        style="height:10px;display: flex;align-items: center;justify-content: space-between;flex-direction: row;padding: 12px;">
                    <div class="layui-card-header" style="font-size: 17px;">增长趋势</div>
                    <div>
                        <input type="text" id="test1" class="layui-input_style">
                    </div>
                </div>
                <canvas id="myLineChart" width="100%" height="20%" style="border-radius: 5px;"></canvas>
            </div>
            <div class="canvas_style_1">
                <div
                        style="width:50%;height:100%;flex: 1;background-color: #FFFFFF;border-radius: 5px 5px 0px 5px;">
                    <div style="font-size: 20px;font-weight: bold;margin-bottom: 10px;margin-left: 5px;">
                        2021年7月销售额概况</div>
                    <div class="cursor_style" style="margin-right: 10px;">
                        <a class="a_hover">切换时段</a>
                        <!-- <div class="cursor_click" style="display: none;">
                                    <span>1月份</span>
                                    <span>2月份</span>
                                    <span>3月份</span>
                                    <span>4月份</span>
                                    <span>5月份</span>
                                    <span>6月份</span>
                                    <span>7月份</span>
                                    <span>8月份</span>
                                    <span>9月份</span>
                                    <span>10月份</span>
                                    <span>11月份</span>
                                    <span>12月份</span>
                                </div>
                    </div>
                    <canvas id="myLineChart_1"
                            style="background-color:#ffffff;margin-right: 10px;border-radius: 5px;"></canvas>
                </div>
                <div
                        style="width:50%;height:100%;flex: 1;margin-left: 10px;background-color: #ffffff;border-radius: 5px 5px 0px 5px;">
                    <div style="font-size: 20px;margin-left: 5px;font-weight: bold;margin-bottom: 10px;">
                        2021年7月订单量概况</div>
                    <div class="cursor_style_1" style="margin-left: 10px;">
                        <a class="a_hover">切换时段</a>
                        <!-- <div class="cursor_click_1" style="display: none;">
                                    <span>1月份</span>
                                    <span>2月份</span>
                                    <span>3月份</span>
                                    <span>4月份</span>
                                    <span>5月份</span>
                                    <span>6月份</span>
                                    <span>7月份</span>
                                    <span>8月份</span>
                                    <span>9月份</span>
                                    <span>10月份</span>
                                    <span>11月份</span>
                                    <span>12月份</span>
                                </div>
                    </div>
                    <canvas id="myLineChart_2"
                            style="background-color:#ffffff;margin-left: 10px;border-radius: 5px;"></canvas>
                </div>
            </div>
            <div style="display: flex;">
                <div
                        style="width:50%;height:100%;flex: 1;background-color: #FFFFFF;border-radius:0 5px 5px 5px ;margin-right: 5px;">
                    <div style="font-size: 20px;font-weight: bold;margin-bottom: 10px;">
                        每日销售额</div>
                    <canvas id="myLineChart_3"
                            style="background-color:#ffffff;border-radius: 5px;margin-right: 10px;"></canvas>
                </div>
                <div
                        style="width:50%;height:100%;flex: 1;background-color: #FFFFFF;border-radius: 0 5px 5px 5px;margin-left: 5px;">
                    <div style="font-size: 20px;margin-left: 13px;font-weight: bold;margin-bottom: 10px;">
                        每日订单量</div>
                    <canvas id="myLineChart_4"
                            style="background-color:#ffffff;border-radius: 5px;margin-left: 10px;"></canvas>
                </div>
            </div>
            <div style="font-size: 20px;font-weight: bold;margin-top: 20px;margin-bottom: 10px;">满意度概况</div>
            <div style="display: flex;justify-content: space-around;">
                <div
                        style="width:30%;height:100%;background-color: #FFFFFF;border-radius: 5px;margin-right: 5px;">
                    <div style="font-size: 20px;font-weight: bold;margin-bottom: 10px;">
                        商品满意度</div>
                    <canvas id="myLineChart_5"
                            style="background-color:#ffffff;margin-right:10px;border-radius: 5px;"></canvas>
                </div>
                <div
                        style="width:30%;height:100%;background-color: #FFFFFF;border-radius: 5px;margin-left: 5px;">
                    <div style="font-size: 20px;margin-left: 13px;font-weight: bold;margin-bottom: 10px;">
                        服务满意度</div>
                    <canvas id="myLineChart_6"
                            style="background-color:#ffffff;margin-left:10px;border-radius: 5px;"></canvas>
                </div>
                <div
                        style="width:30%;height:100%;;background-color: #FFFFFF;border-radius: 5px;margin-left: 10px;">
                    <div style="font-size: 20px;margin-left: 13px;font-weight: bold;margin-bottom: 10px;">
                        环境满意度</div>
                    <canvas id="myLineChart_7"
                            style="background-color:#ffffff;margin-left:10px;border-radius: 5px;"></canvas>
                </div>
                <!-- 						<div style="display: flex;justify-content:center; width: 50%;">
                            <div style="width:50%;height:100%;flex: 1;position: relative;left: 50%;">
                                <div style="font-size: 20px;font-weight: bold;margin-bottom: 10px;">
                                    环境满意度</div>
                                <canvas id="myLineChart_7"
                                    style="background-color:#ffffff;margin-left: 10px;border-radius: 5px;"></canvas>
                            </div>
                        </div>
            </div>
        </div>
    </div>-->

</div>
<!--<script type="text/javascript">-->
<!--    var ctx = document.getElementById("myLineChart");-->
<!--    var myLineChart = new Chart(ctx, {-->
<!--        type: 'line',-->
<!--        data: {-->
<!--            labels: ["星期1", "星期2", "星期3", "星期4", "星期5", "星期6", "星期1", "星期2", "星期3", "星期4", "星期5", "星期6"],-->
<!--            datasets: [{-->
<!--                label: '单位:人',-->
<!--                data: [20, 30, 50, 40, 50, 60, 70, 60, 80, 90, 80, 60, ],-->
<!--                borderColor: [-->
<!--                    "#32bb77"-->
<!--                ],-->
<!--                backgroundColor: [-->
<!--                    "#32bb77"-->
<!--                ],-->

<!--                borderWidth: 1-->
<!--            }]-->
<!--        },-->
<!--        options: {-->
<!--            scales: {-->
<!--                yAxes: [{-->
<!--                    ticks: {-->
<!--                        beginAtZero: true-->
<!--                    }-->
<!--                }]-->
<!--            }-->
<!--        }-->
<!--    });-->
<!--    var ctx_1 = document.getElementById("myLineChart_1");-->
<!--    var myLineChart_1 = new Chart(ctx_1, {-->
<!--        type: 'line',-->
<!--        data: {-->
<!--            labels: ["1", "2", "3", "4", "5", "6", "1", "2", "3", "4", "5", "6"],-->
<!--            datasets: [{-->
<!--                label: '单位:元 &#45;&#45;7月目标',-->
<!--                data: [10, 20, 30, 40, 50, 60, 70, 80],-->
<!--                borderColor: [-->
<!--                    "#32bb77"-->
<!--                ],-->
<!--                backgroundColor: [-->
<!--                    "#32bb77"-->
<!--                ],-->

<!--                borderWidth: 1-->
<!--            }]-->
<!--        },-->
<!--        options: {-->
<!--            scales: {-->
<!--                yAxes: [{-->
<!--                    ticks: {-->
<!--                        beginAtZero: true-->
<!--                    }-->
<!--                }]-->
<!--            }-->
<!--        }-->
<!--    });-->
<!--    var ctx_2 = document.getElementById("myLineChart_2");-->
<!--    var myLineChart_2 = new Chart(ctx_2, {-->
<!--        type: 'line',-->
<!--        data: {-->
<!--            labels: ["1", "2", "3", "4", "5", "6", "1", "2", "3", "4", "5", "6"],-->
<!--            datasets: [{-->
<!--                label: '单位:元 &#45;&#45;7月目标',-->
<!--                data: [10, 20, 30, 40, 50, 60, 70, 80],-->
<!--                borderColor: [-->
<!--                    "#32bb77"-->
<!--                ],-->
<!--                backgroundColor: [-->
<!--                    "#32bb77"-->
<!--                ],-->

<!--                borderWidth: 1-->
<!--            }]-->
<!--        },-->
<!--        options: {-->
<!--            scales: {-->
<!--                yAxes: [{-->
<!--                    ticks: {-->
<!--                        beginAtZero: true-->
<!--                    }-->
<!--                }]-->
<!--            }-->
<!--        }-->
<!--    });-->
<!--    var ctx_3 = document.getElementById("myLineChart_3");-->
<!--    var myLineChart_3 = new Chart(ctx_3, {-->
<!--        type: "bar",-->
<!--        data: {-->
<!--            labels: ["1", "2", "3", "4", "5", "6", "1", "2", "3", "4", "5", "6"],-->
<!--            datasets: [{-->
<!--                label: '单位:元 ',-->
<!--                data: [10, 20, 30, 40, 50, 60, 70, 80],-->
<!--                borderColor: [-->
<!--                    "#32bb77"-->
<!--                ],-->
<!--                backgroundColor: [-->
<!--                    "#32bb77"-->
<!--                ],-->

<!--                borderWidth: 1-->
<!--            }]-->
<!--        },-->
<!--        options: {-->
<!--            scales: {-->
<!--                yAxes: [{-->
<!--                    ticks: {-->
<!--                        beginAtZero: true-->
<!--                    }-->
<!--                }]-->
<!--            }-->
<!--        }-->
<!--    });-->
<!--    var ctx_4 = document.getElementById("myLineChart_4");-->
<!--    var myLineChart_4 = new Chart(ctx_4, {-->
<!--        type: "bar",-->
<!--        data: {-->
<!--            labels: ["1", "2", "3", "4", "5", "6", "1", "2", "3", "4", "5", "6"],-->
<!--            datasets: [{-->
<!--                label: '单位:元 ',-->
<!--                data: [10, 20, 30, 40, 50, 60, 70, 80],-->
<!--                borderColor: [-->
<!--                    "#32bb77"-->
<!--                ],-->
<!--                backgroundColor: [-->
<!--                    "#32bb77"-->
<!--                ],-->

<!--                borderWidth: 1-->
<!--            }]-->
<!--        },-->
<!--        options: {-->
<!--            scales: {-->
<!--                yAxes: [{-->
<!--                    ticks: {-->
<!--                        beginAtZero: true-->
<!--                    }-->
<!--                }]-->
<!--            }-->
<!--        }-->
<!--    });-->
<!--    var ctx_5 = document.getElementById("myLineChart_5");-->
<!--    var options = {}-->
<!--    var data = {-->
<!--        labels: ["商品好评率", "商品中评率", "商品好评率"],-->
<!--        datasets: [{-->
<!--            backgroundColor: ["#60b565", "#5894ff", "#72cdd7"],-->
<!--            data: [20, 30, 70]-->
<!--        }]-->
<!--    };-->
<!--    var myLineChart_5 = new Chart(ctx_5, {-->
<!--        type: "doughnut",-->
<!--        data: data,-->
<!--        options: options-->
<!--    });-->
<!--    var ctx_6 = document.getElementById("myLineChart_6");-->
<!--    var options = {}-->
<!--    var data = {-->
<!--        labels: ["商品好评率", "商品中评率", "商品好评率"],-->
<!--        datasets: [{-->
<!--            backgroundColor: ["#60b565", "#5894ff", "#72cdd7"],-->
<!--            data: [20, 30, 70]-->
<!--        }]-->
<!--    };-->
<!--    var myLineChart_6 = new Chart(ctx_6, {-->
<!--        type: "doughnut",-->
<!--        data: data,-->
<!--        options: options-->
<!--    });-->
<!--    var ctx_7 = document.getElementById("myLineChart_7");-->
<!--    var options = {}-->
<!--    var data = {-->
<!--        labels: ["商品好评率", "商品中评率", "商品好评率"],-->
<!--        datasets: [{-->
<!--            backgroundColor: ["#60b565", "#5894ff", "#72cdd7"],-->
<!--            data: [20, 30, 70]-->
<!--        }]-->
<!--    };-->
<!--    var myLineChart_7 = new Chart(ctx_7, {-->
<!--        type: "doughnut",-->
<!--        data: data,-->
<!--        options: options-->
<!--    });-->
<!--    //日期范围-->
<!--    //初始赋值-->
<!--    //执行一个laydate实例-->
<!--    layui.use('laydate', function() {-->
<!--        var laydate = layui.laydate;-->
<!--        laydate.render({-->
<!--            elem: '#test1',-->
<!--            range: true, //或 range: '~' 来自定义分割字符，-->
<!--            value: ""-->
<!--        });-->
<!--    });-->
<!--</script>-->
{include file="public/footer" /}